<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

</head>
<body>
<div id="app_dialog" class="content-div">
    <!-- 列表显示区间 start -->
	<div>
	     <!-- 查询块 start -->
	     <div >
		   	 <div class="panel panel-default">
		        <div >
		            <form id="formSearch" class="form-horizontal">
		               <div class="form-group" >
		                    <div class="col-sm-3">
		                    	<div class="input-group">
		                    		<div class="input-group-btn">
										<button class="btn btn-white" type="button">{{sysRoleField.roleName}}</button>
									</div>
				                        <input type="text" class="form-control" v-model="search.roleName" 
				                        onkeyup="this.value=this.value.trim()"/>
		                    	</div>
		                    </div>
		                    <div class="col-sm-3" style="text-align:left;">
		                        <button type="button" style="margin-left:10px" id="btn_query" class="btn btn-primary" @click="reload">{{pageData.query}}</button>
		                    </div>
		                </div>
		            </form>
		        </div>
		    </div>
	    </div>
	    <!-- 查询块 end -->   
	    <!-- 列表table显示 start -->
	    <table id="table_dialog"></table>
	    <!-- 列表table显示end -->
	</div>
    <!-- 列表显示区间 end -->
</div>
<script>
var sysRoleField = dataObject.sysRoleField;
var vm_dialog = new Vue({
	el:'#app_dialog',
	data:{
		 search:{
			 roleName:""
		 }
	},
	methods: {
		reload: function () {
			$('#table_dialog').bootstrapTable('refresh'); 
		}
	}
});

$(function () {
	  var columns =[
					{field: 'state', checkbox: true},
					{field: 'roleName' , title: sysRoleField.roleName, sortName:'role_name' , sortable: true,halign: 'center',align: 'center'},
					{field: 'remark' , title: sysRoleField.remark, sortName:'remark' , sortable: true,halign: 'center',align: 'center'},
					{field: 'createUserName' , title: sysRoleField.createUserName, sortName:'CREATE_BY' , sortable: true,halign: 'center',align: 'center'},
					{field: 'createTime' , title: sysRoleField.createTime, sortName:'create_time' , sortable: true,halign: 'center',align: 'center'},
		         ];
	 $table_dialog = new DialogTable("table_dialog", $path + '/sys/sysrole/list', columns,"",430,'roleId','role_id','sysrole',singleStatus,'name');
	 var queryParams = function(params) {            
	     return {
		         	  page: params.pageNumber,
		         	  limit: params.pageSize,
		         	  sidx: params.sortName,
		              order: params.sortOrder,
	                  roleName:vm_dialog.search.roleName,              //查询字段
	                  userRole: userRole, //是否要查询用户所拥有的角色
	                  status:2
	         };
	 };    
	 $table_dialog.setQueryParams(queryParams);
	 $table_dialog.init();
	 
});




</script>
</body>
</html>